<template>
	<view class="page">
		<view class="head">
			<view class="head1">
				<text class="iconfont icon-fenxiang1" @click="goBack"></text>
				<text class="nav-title">推荐菜品</text>
			</view>
		</view>

		<view class="main">
			<!-- 菜单 -->
			<view class="menu">
				<view
					class="title"
					:class="{'selected': selectedIndex === 0}"
					@click="selectTitle(0)"
				>
					特价系列
				</view>
				<view
					class="title"
					:class="{'selected': selectedIndex === 1}"
					@click="selectTitle(1)"
				>
					热销推荐
				</view>
			</view>
			<!-- 详情 -->
			<view class="detail">
				<view class="item" v-for="(item, index) in storeList" :key="index">
					<image :src="item.img"></image>
					<view class="detail1">
						<view class="top">
							<view class="title">{{ item.title }}</view>
							<view class="detail2">
								<view class="now">
									<view class="title1">现价￥</view>
									<view class="nowPrice">{{ item.nowPrice }}</view>
								</view>

								<view class="integral">+{{ item.integral }}积分</view>
								<view class="price">￥{{ item.price }}</view>
							</view>
						</view>
						<view class="bottom">
							<view class="">
								
							</view>
							<view class="specification">规格：{{ item.nowPrice}}/份</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
export default {
  data() {
    return {
      storeList: [],
      selectedIndex: 0, // 默认为选中第一个标题
    };
  },
  methods: {
    goBack() {
      uni.navigateBack(-1);
    },
    selectTitle(index) {
      this.selectedIndex = index;
    },
    // 随机生成价格
    generateRandomPrice(min, max) {
      return (Math.random() * (max - min) + min).toFixed(2);
    },
    // 随机生成积分
    generateRandomIntegral(min, max) {
      return Math.floor(Math.random() * (max - min + 1)) + min;
    },
  },
  onLoad() {
    const itemDetail = uni.getStorageSync('itemDetail');
    console.log('111', itemDetail); // 这里将显示存储的 item 数据

    if (itemDetail && itemDetail.detail) {
      // 如果存在 itemDetail 并且有 detail 属性
      this.storeList = itemDetail.detail.singleList;
    } else {
      this.storeList = itemDetail.singleList || [];
    }

    // 给 storeList 中的每一项添加随机的价格和积分
    this.storeList.forEach((item) => {
      item.price = this.generateRandomPrice(100, 300); // 随机生成价格
      item.nowPrice = this.generateRandomPrice(10, 99); // 随机生成现价
      item.integral = this.generateRandomIntegral(10, 50); // 随机生成积分
    });
  },
};
</script>


<style scoped lang="scss">
	@import 'recommend.scss';
	  
</style>